<template>
  <div
    :style="{
      background: themeStore.isDark ? '' : '#fff',
      padding: '20px',
      height: '100%',
    }"
  >
    <el-alert
      title="今日订单总计：140单 已送39 未送101 A：已送32 未送21 B：已送5 未送56 C：已送1
    未送24"
      type="error"
      :closable="false"
    />
    <el-card
      v-for="item in tableData"
      :key="item"
      style="width: 16.6%; background: #eef7fd; float: left;margin-top: 0.5%;border: 0px;"
      shadow="never"
    >
     <div style=" line-height: 30px; border: 1px solid #eef7fd; padding: 5px; text-align: center;"> {{ item.dispatchingNumber }} {{ item.driver }} {{ item.poll }}(票)</div>
      <el-table
        :data="item.disVos"
        border
        v-loading="loading"
        style="width: 100%;"
      >
        <el-table-column prop="period" label="时段" align="center" />
        <el-table-column prop="incomplete" label="未完成" align="center" />
        <el-table-column prop="complete" label="完成" align="center" />
      </el-table>
    </el-card>
  </div>
</template>

<script setup>
import { ref,onMounted } from "vue";
import { useThemeStore } from "@/stores/models/theme/theme.js";
import useUserStore from "@/stores/models/user/user.js";
import { findBoard } from "@/api/order";
import { ElMessage } from "element-plus";

const themeStore = useThemeStore();
const loading = ref(false);
const tableData = ref([
  {
    number: "PG0901",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0901",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0903",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
  {
    number: "PG0904",
    name: "熊洪春",
    poll: 12,
    list: [
      {
        A: "A",
        B: "5",
        C: "0",
      },
      {
        A: "B",
        B: "3",
        C: "0",
      },
      {
        A: "C",
        B: "4",
        C: "0",
      },
    ],
  },
]);
const currentDate = ref('');

onMounted(() => {
  getCurrentDate();
  getList();
});
const getCurrentDate = () => {
  const date = new Date();
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0');
  const day = String(date.getDate()).padStart(2, '0');
  currentDate.value = `${year}-${month}-${day}`;
};
async function getList() {
  var  params = {
    time: currentDate.value,
  };
  findBoard(params)
    .then((res) => {
      console.log(res);
      loading.value = false;
      if (res.code === 200 && res.data !== null) {
        tableData.value = res.data;
      }
    })
    .catch((err) => {
      loading.value = false;
      ElMessage.error(err.message);
      console.log(err.message);
    });
}
</script>

<style scoped lang="scss">
</style>
